// store.ts
import { InjectionKey } from 'vue'
import { createStore } from 'vuex'
import type { ActionContext, Store } from 'vuex';

export interface MuChangePayload { index: number, num: number }
export interface MuCancelPayload { flag: boolean, num?: number }
// 为 store state 声明类型
export interface State {
  dialogVisible: boolean,
  activeIndex: number,
  num: number,
  flag: boolean
}


// 定义 injection key
export const key: InjectionKey<Store<State>> = Symbol()

export const store = createStore<State>({
  state: {
    dialogVisible: false,
    activeIndex: 0,
    num: 1,
    flag: false,
  },
  mutations: {
    handlerModal(state: State, payload: MuChangePayload): void {
      state.activeIndex = payload.index
      state.num = payload.num
      state.dialogVisible = true
    },
    cancel(state: State, payload: MuCancelPayload): void {
      if (payload.flag) {
        state.num = payload.num as number
        state.flag = !state.flag
      }
      state.dialogVisible = false
    },
  },
})